<template>
	<div class="action_sheet_cont">
		<div class="action_btn" @click="openActionSheet">打开上拉菜单</div>
		<mt-actionsheet
		  :actions="actions"
		  v-model="sheetVisible"
		  cancelText='取消'>
		</mt-actionsheet>
	</div>
</template>


<script>
	import { Actionsheet  } from 'mint-ui'
	export default{
		components:{Actionsheet},
		data(){
			return{
				actions:[{name:'拍照',method:this.openCanmera},{name:'从相册中选取',method:this.chooseInAlbum}],
				sheetVisible:false //上拉菜单的显示与隐藏
			}
		},
		methods:{
			openActionSheet(){
				this.sheetVisible = true
			},
			//点击拍照的回调
			openCanmera(){
				console.log('打开相机')
			},
			//点击打开相册的回调
			chooseInAlbum(){
				console.log('打开相册')

			}
		},
		mounted(){

		}
	}


</script>

<style lang="scss" scoped>
	.action_sheet_cont{
		padding:0 5px;
		.action_btn{width:100%;background-color:#f4f4f4;color:#ff2525;font-size:16px;text-align:center;height:40px;line-height: 40px;border-radius:5px;}
	}
</style>